<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>
	<script type="text/javascript"
		src="http://maps.google.com/maps/api/js?sensor=true" />
	<link href="css/style_teste.css" rel="stylesheet" type="text/css" />
	<title>Destino Certo</title>
</h:head>
<h:body>
<ui:include src="topo.xhtml"></ui:include>
	
	<p:growl id="mensagem" showDetail="true" showSummary="false"></p:growl>
	<div class="limitar">

		<div class="painel_esquerdo">
			<h:panelGrid columns="1">
				<h:form>
				<h:panelGrid columns="1">
					<h:outputText value="Onde você está ?" />
					<p:inputText value="#{destinoCertoMB.origem}"></p:inputText>
					
					<h:outputText value="Onde você deseja ir ?" />
					<p:inputText value="#{destinoCertoMB.destino}"></p:inputText>
               
                    <h:commandButton value="pesquisar" actionListener="#{destinoCertoMB.selecionarDestino}"></h:commandButton>

<!-- 					<h:dataTable id="tabela" var="parada" style="font-size:16px; width:280px;" -->
<!-- 						value="#{destinoCertoMB.listaParada2}"> -->
<!-- 						<h:column> -->
<!-- 						<h:outputText style="font-size:14px;" value="#{parada.ordem} - #{parada.nome}"></h:outputText> -->
<!-- 						</h:column> -->
<!-- 					</h:dataTable> -->
<br/>
<h:outputLabel value="#{destinoCertoMB.onibusPegar}"/>
					 </h:panelGrid>

				</h:form>

			</h:panelGrid>

		</div>

		<div class="painel_direito">
			<p:gmap id="mapa" center="#{destinoCertoMB.posicao}" zoom="14"
				model="#{destinoCertoMB.polylineModel}" type="ROADMAP"
				style="width:750px;height:600px">
			</p:gmap>

		</div>
	</div>
</h:body>
</html>